<template>
  <div>
    <div class="block">
      <el-pagination
        background
        jumper
        layout="prev, pager, next, jumper"
        :total="page"
        @current-change="handleCurrentChange"
      >
      </el-pagination>
    </div>
  </div>
</template>

<script>
export default {
  props: {
    page: {
      type: [Array, Number],
      default: 1,
    },
  },
  methods: {
    handleCurrentChange(val) {
      this.$bus.$emit("pageVal", val);
    },
  },
};
</script>

<style>
.el-pagination.is-background .el-pager li:not(.disabled):hover {
  color: #109d59;
}
.el-pagination.is-background .el-pager li:not(.disabled).active {
  color: #fff;
  background: #109d59;
}
</style>